Ext.onReady(function() {

    Ext.QuickTips.init();

    // turn on validation errors beside the field globally
    Ext.form.Field.prototype.msgTarget = 'side';

    var bd = Ext.getBody();
    
    /*
     * ================  Field Required  =======================
     */
    bd.createChild({tag: 'h2', html: 'Form 1 - Very Simple'});
    
    var simple = new Ext.FormPanel({
        labelWidth: 75, // label settings here cascade unless overridden
        frame: true,
        title: 'Simple Form',
        bodyStyle: 'padding:5px 5px 0',
        width: 350,
        defaults: {
            width: 230
        },
        defaultType: 'textfield',

        items: [{
            fieldRequired: true,
            fieldLabel: 'First Name',
            name: 'first',
            allowBlank: false
        }, {
            fieldRequired: true,
            fieldLabel: 'Last Name',
            name: 'last'
        }, {
            fieldLabel: 'Company',
            name: 'company'
        }, {
            fieldRequired: true,
            fieldLabel: 'Email',
            name: 'email',
            vtype: 'email'
        }, new Ext.form.TimeField({
            fieldLabel: 'Time',
            name: 'time',
            minValue: '8:00上午',
            maxValue: '6:00下午'
        })],

        buttons: [{
            text: 'Save'
        }, {
            text: 'Cancel'
        }]
    });

    simple.render(document.body);

});